
.mui-bar-tab
  -webkit-box-shadow: 0 0 1px #cccccc !important
  box-shadow: 0 0 1px #cccccc !important

.theme-color
  color: #2ac845 !important

.content
  padding-top: 42px;

//基于两层flex布局实现
.search-header
  position: fixed;
  top: 0px;
  height: 42px;
  background: #fff;
  display: flex;
  right: 0;
  left: 0;
  border-bottom: 1px solid #e5e5e5;
  align-items: center;
  z-index: 1000;


.search-header
  .item
    flex: 1
    font-size: 13px;
    // border: 1px solid red;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    // overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
  .item:before
    content: "";
    width: 1px;
    height: 13px;
    background: #c7c7cc;
    position: absolute;
    right: 0px;
    top: 14px;
  .item.active
    color:  #2ac845
    .mui-icon
      transform: rotate(180deg);
      -webkit-transform: rotate(180deg);
      color: #2ac845;
  .search
    height: 100%;
    width: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    .mui-icon
      font-size: 21px;
  .mui-icon
    font-size: 18px
    color: rgba(0, 0, 0, .5)
    position: relative;
    top: 1px;

.hide
  display: none;

.hide-modal
  // -webkit-transition: all ease 3ms !important;
  // transition: all ease 3ms !important;
  // visibility: hidden;


.top-down-modal
  position: fixed;
  z-index: 999;
  top: 0;
  overflow: hidden;
  width: 100%;
  min-height: 65%;
  -webkit-transition: all ease .35s;
  transition: all ease .35s;
  -webkit-transform: translate3d(0,-100%,0);
  transform: translate3d(0,-100%,0);
  background-color: #fff;

.top-down-modal.active
  -webkit-transform: translate3d(0,42px,0);
  transform: translate3d(0,42px,0);
